
// 按需引入 引入 ECharts 主模块
/*
* ↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓（启动方法）
* echartsInit(Array).callback = {}
*            ↓↓↓
*   [pie,bar,scatter,tooltip,title,legend,toolbox] => 按需加载，填在里面的都是不加载的模块
* ↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓（创建实例，加载图表）
* .setCharts(obj, id（如果没有高度需要，第二参数被事件回调取代）, callback(高度回调), eventsCallback(事件回调，可选))
* ↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓（参数说明）
* obj => [图表集:{图表参数}，{图表参数}] ↓↓↓↓↓↓
* 图表参数 => {id(容器),type（图标类型，只能支持（pie，bar）），events（事件类型），xData（x轴参数），trigger（鼠标hover效果，和api一样格式），formatter（鼠标hover效果，和api一样格式），barWidth（柱形大小，可选）,value（值）,entire（最大值，只有饼图进度条才用）,title（标题显示，饼图进度条无此参数），Legend（下标,可选），labelLine（引导线，和api一样，可选），label（echarts 富文本，和api一样写法，可选），viewSetting（饼图的一些形状设置），grid（区域留位，和api一样）}
* title => {text（title名称，可选），fontSize（title字体大小，可选），align（水平对齐方式，可选），left（String，可选，默认值），right（String，可选），top（String，可选），bottom（String，可选）}
* value => 饼图进度条为（数值）,其他的为（[{value(饼图为数值，并且还要在数组里面再加上一层数组，代表一模块（暂时饼图用）；条形图为数组[number,number,…]),name（该模块名字），filterName（折线图为字符串，散点图为数组[x,y,name,length]），color（折线图为字符串（rgba颜色部分）；散点图为数组（[除去rgba的颜色]））,symbolSize（散点图，散点大小（number）），shadow（{blur（阴影大小（number），color（阴影颜色rgba格式）}）},…]），
* xData => 条形图独有（[String,String,…],或者纵横交换和需要改变什么值{data（Array），max（最大值,x轴的为Xmax），type（布尔值，可选，为true就是纵横交换），symbol（单位），unify（'value'，可选用），interval（轴的数值间隔多少，x轴为Xinterval），name（名称,X轴为Xname），gap（坐标轴两边是否要留白），formatter（轴显示的值变成自己喜欢的样子，x轴为Xformatter），axisLine（y标线，不填为不见，x轴为XaxisLine） axisTick（y横线，不填为不见，x轴为XaxisTick）splitLine（是否显示内容区分割线，默认是开启的，x轴为XsplitLine）,positionType (说明此条归属，x表示x轴，y表示y轴，没有表示两个)}）
* Legend => 下标（{orient（摆放方向），type（plain（默认）或scroll（下标过长，开启滚动）），x（水平对齐），y（垂直对齐）,show (true) 下标开关}）,，svgPath（[下标符号，可选，默认为空心圆]，和id同级）,gap（下标之间的间距），align（图标对齐方式left，right），iW（icon的宽度），iH（icon的高度）)
* viewSetting => （{radius（饼图大小[['内半径','外半径']，['内半径','外半径']，…]，center（对齐[['左右对齐%'，'上下对齐%']，['左右对齐%'，'上下对齐%']。…]），roseType（去分别试试吧[false,'radius','area']）}）
* ↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓（所需说明）
* 饼图进度条：{id,type,value,entire,text}
* 其他：{id,type,value,text,fontSize,formatter,xData(条形图专属)}
* ↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓（重载方法）
* .loadCharts(obj = {})
* */
import Cookies from 'js-cookie'
const echarts = require('echarts/lib/echarts');
const status = [];
export function echartsInit(event = []) {
  // 按需引入图表组件
  const startModule = event;
  function module(e) {
    // 引入散点图
    e.indexOf('scatter') >= 0 && status.indexOf('scatter') === -1 && require('echarts/lib/chart/scatter') && (status.push('scatter'));
    // 引入饼图
    e.indexOf('pie') >= 0 && status.indexOf('pie') === -1 && require('echarts/lib/chart/pie') && (status.push('pie'));
    // 引入柱状图
    e.indexOf('bar') >= 0 && status.indexOf('bar') === -1 && require('echarts/lib/chart/bar') && (status.push('bar'));
    // 引入曲线图
    e.indexOf('line') >= 0 && status.indexOf('line') === -1 && require('echarts/lib/chart/line') && (status.push('line'));
    // 引入提示框组件
    e.indexOf('tooltip') >= 0 && status.indexOf('tooltip') === -1 && require('echarts/lib/component/tooltip') && (status.push('tooltip'));
    // 引入标题组件
    e.indexOf('title') >= 0 && status.indexOf('title') === -1 && require('echarts/lib/component/title') && (status.push('title'));
    // 引入下标组件
    e.indexOf('legend') >= 0 && status.indexOf('legend') === -1 && require('echarts/lib/component/legend') && (status.push('legend'));
    // 引入下标过长滚动组件
    e.indexOf('legendScroll') >= 0 && status.indexOf('legendScroll') === -1 && require('echarts/lib/component/legendScroll') && (status.push('legendScroll'));
    // 引入工具栏组件
    e.indexOf('toolbox') >= 0 && status.indexOf('toolbox') === -1 && require('echarts/lib/component/toolbox') && (status.push('toolbox'));
    // 引入区域缩放组件
    e.indexOf('dataZoom') >= 0 && status.indexOf('dataZoom') === -1 && require('echarts/lib/component/dataZoom') && (status.push('dataZoom'));
    // 引入图标组件
    e.indexOf('markPoint') >= 0 && status.indexOf('markPoint') === -1 && require('echarts/lib/component/markPoint') && (status.push('markPoint'));
  }

  return {
    sidebarStatus: Cookies.get('sidebarStatus'),
    echartsColor: ['#CF717A', '#EE964D', '#EFCD6D', '#9888BB', '#61A0A8', '#D48265', '#91C7AE', '#749F83', '#CA8622', '#BDA29A', '#83878E', '#546570', '#A4B5C5'],
    svgPath: 'path://M512 1024C229.6 1024 0 794.4 0 512S229.6 0 512 0s512 229.6 512 512S794.4 1024 512 1024zM512 96c-229.6 0-416 186.4-416 416 0 229.6 186.4 416 416 416s416-186.4 416-416C928 282.4 741.6 96 512 96z',
    labelLine: { /* 引导线*/
      normal: {
        length: 5,
        // length2: 7,
        lineStyle: {
          // color: '#E4E4E4'
        }
      }
    },
    label: { /* echarts 富文本*/
      normal: {
        formatter: '{b|{b}}：{c|{d}%}', /* {c|{d}%}{hr|}{b|{b}}*/
        // color: '#999',
        rich: {
          /* b: {
            align: 'center',
            color: '#333'
          },
          hr: {
            borderColor: '#E4E4E4',
            width: '100%',
            borderWidth: 0.5,
            height: 0,
            lineHeight: 5
          },*/
          /* c: {
            align: 'center',
            color: '#333'
          }*/
        }
      }
    },
    titleOption(e) {
      /* title*/
      e.align || (e.align = 'left');
      const title = {
        text: e.text || '',
        x: e.align || 'left',
        top: e.top || (e.bottom ? 'auto' : '5%'),
        bottom: e.bottom || 'auto',
        textStyle: {
          color: e.color || '#6F6F6F',
          fontSize: e.fontSize,
          rich: e.rich || ''
        }
      };
      (e.align === 'center') || (title.left = e.left || (e.align === 'left' ? '5%' : 'auto'));
      (e.align === 'center') || (title.right = e.right || '5%');
      return title;
    },
    LegendOption(e) {
      /* 下标操作*/
      const attr = [];
      e.Legend || (e.Legend = {});
      if ((e.type !== 'pie') && (e.value.length > 1)) {
        return {};
      }
      for (let i = 0; i < e.value[0].length; i++) {
        attr[i] = { name: e.value[0][i].name, icon: (e.svgPath && (e.svgPath[i] ? e.svgPath[i] : this.svgPath)) || 'rect' }
        if (e.value[0][i].type === 'pie') {
          for (let j = 0; j < e.value[0][i].name.length; j++) {
            attr[j] = { name: e.value[0][i].name[j], icon: (e.svgPath && (e.svgPath[i] ? e.svgPath[i] : this.svgPath)) || 'rect' }
          }
        }
      }
      return {
        show: !e.Legend.show,
        orient: e.Legend.orient || 'horizontal',
        type: e.Legend.type || 'plain', // scroll
        x: e.Legend.x || 'auto',
        y: e.Legend.y || 'auto',
        left: e.Legend.left || 'auto',
        right: e.Legend.right || 'auto',
        align: e.Legend.align || 'auto',
        itemGap: e.Legend.gap || 10,
        itemWidth: e.Legend.iW || 15,
        itemHeight: e.Legend.iH || 10,
        padding: 20,
        data: attr
      }
    },
    toolboxOption(e) {
      /* 是否开启下载功能*/
      return {
        show: e,
        top: '10%',
        right: '5%',
        feature: {
          mark: { show: true },
          dataView: { show: true, readOnly: false },
          magicType: {
            show: true,
            type: ['pie', 'funnel']
          },
          restore: { show: true },
          saveAsImage: { show: true }
        }
      }
    },
    datasetSource(e) {
      const source = [];
      if (e.xData) {
        for (let i = 0; i < e.xData.data.length; i++) {
          if (!source[0]) { source[0] = ['product'] }
          source[0].push(e.xData.data[i]);
        }
      }
      for (let j = 0; j < e.value[0].length; j++) {
        if (!source[0]) { e.value[0] = ['product', e.value[0][j].name] }
        if (!source[j + 1]) { source[j + 1] = [e.value[0][j].name] }
        source[j + 1] = source[j + 1].concat(e.value[0][j].value);
      }
      return {
        source: source
      }
    },
    seriesDataAll(e) {
      const serAll = [];
      for (let i = 0; i < e.value[0].length; i++) {
        if (e.value[0][i].type === 'pie') {
          serAll[i] = {
            type: 'pie',
            name: e.value[0][i].name || '',
            avoidLabelOverlap: e.value[i][0].avoidLabelOverlap !== 'false',
            radius: ((Array.isArray(e.viewSetting) && e.viewSetting[i].radius) || e.viewSetting.radius) || ['35%', '60%'],
            center: ((Array.isArray(e.viewSetting) && e.viewSetting[i].center) || e.viewSetting.center) || ['50%', '50%'],

            roseType: ((Array.isArray(e.viewSetting) && e.viewSetting[i].roseType) || e.viewSetting.roseType) || false, label: e.value[0][i].label || this.label,
            labelLine: e.value[0][i].labelLine || this.labelLine,
            data: []
            // data: e.value[0][i].filterName ? e.value[0][i].value.map((item) => { return item[e.value[0][i].filterName] }) : e.value[0][i].value
          };
          if (e.value[0][i].label === 'false') {
            serAll[i].label = { normal: { show: false }}
          }
          if (e.value[0][i].labelLine === 'false') {
            serAll[i].labelLine = { normal: { show: false }}
          }
          for (let j = 0; j < (e.value[0][i].value.filterName ? e.value[0][i].value.data.length : e.value[0][i].value.length); j++) {
            serAll[i].data[j] = {
              value: e.value[0][i].value.filterName ? e.value[0][i].value.data[j][e.value[0][i].value.filterName] : e.value[0][i].value[j],
              name: e.value[0][i].name[j]
            }
          }
        }
        if (e.value[0][i].type === 'bar') {
          serAll[i] = {
            type: 'bar',
            name: e.value[0][i].name,
            yAxisIndex: e.value[0][i].y || 0,
            xAxisIndex: e.value[0][i].x || 0,
            seriesLayoutBy: 'row',
            z: 3,
            barMaxWidth: e.barWidth,
            stack: e.value[0][i].stack || null,
            itemStyle: {
              normal: {
                barBorderRadius: e.value[0][i].radius || 0
              }
            },
            barGap: e.value[0][i].barGap,
            label: e.value[0][i].label || {
              normal: {
                color: '#000',
                position: 'top',
                padding: (e.value[0][i].formatter && e.value[0][i].formatter.padding) || [0, 0],
                show: !!e.value[0][i].formatter,
                formatter: (e.value[0][i].formatter && e.value[0][i].formatter.text) || ('{c}' + (e.xData.symbol || '%'))
              }
            },
            itemStyle: e.value[0].length === 1 ? {
              normal: {
                color: (params) => {
                  if (e.value[0][i].itemStyle && e.value[0][i].itemStyle.color) { return e.value[0][i].itemStyle.color[params.dataIndex] }
                  return e.value[0][i].value[params.dataIndex].color || this.echartsColor[params.dataIndex]
                }
              }
            } : {},
            data: e.value[0][i].filterName ? e.value[0][i].value.map((item) => { return item[e.value[0][i].filterName] }) : e.value[0][i].value
          }
        }
        if (e.value[0][i].type === 'line') {
          serAll[i] = {
            name: e.value[0][i].name,
            type: 'line',
            yAxisIndex: e.value[0][i].y || 0,
            xAxisIndex: e.value[0][i].x || 0,
            // stack: '总量',
            data: e.value[0][i].filterName ? e.value[0][i].value.map((item) => { return item[e.value[0][i].filterName] }) : e.value[0][i].value,
            showSymbol: !e.value[0][i].showSymbol,
            hoverAnimation: true,
            symbolSize: 5,
            z: 3,
            smooth: !e.value[0][i].smooth,
            smoothMonotone: 'none',
            label: e.value[0][i].label || {
              normal: {
                color: '#000',
                position: 'top',
                padding: (e.value[0][i].formatter && e.value[0][i].formatter.padding) || [0, 0],
                show: !!e.value[0][i].formatter,
                formatter: (e.value[0][i].formatter && e.value[0][i].formatter.text) || ('{c}' + (e.xData.symbol || '%'))
              }
            }
          }
        }
        if (e.value[0][i].type === 'scatter') {
          serAll[i] = {
            symbolSize: e.value[0][i].symbolSize || 5,
            type: 'scatter',
            yAxisIndex: e.value[0][i].y || 0,
            xAxisIndex: e.value[0][i].x || 0,
            name: e.value[0][i].name,
            // label: {
            //   emphasis: {
            //     show: true,
            //     formatter: function(param) {
            //       return param.seriesName;
            //     },
            //     position: e.value[0][i].position || 'top'
            //   }
            // },
            itemStyle: {
              normal: {
                shadowBlur: e.value[0][i].shadow && e.value[0][i].shadow.blur || 10,
                shadowColor: e.value[0][i].shadow && e.value[0][i].shadow.color || 'rgba(25, 100, 150, 0.5)',
                shadowOffsetY: e.value[0][i].shadow && e.value[0][i].shadow.y || 5,
                color: new echarts.graphic.RadialGradient(0.4, 0.3, 1, [{
                  offset: 0,
                  color: e.value[0][i].color && e.value[0][i].color[0] || 'rgb(129, 227, 238)'
                }, {
                  offset: 1,
                  color: e.value[0][i].color && e.value[0][i].color[1] || 'rgb(25, 183, 207)'
                }])
              }
            },
            data: e.value[0][i].filterName.length ? e.value[0][i].value.map((item) => {
              const value = [];
              for (let j = 0; j < e.value[0][i].filterName.length; j++) {
                value[j] = item[e.value[0][i].filterName[j]];
              }
              return value;
            }) : e.value[0][i].value
          }
        }
      }
      return serAll;
    },
    seriesData(e) {
      if (e.type === 'pie') {
        const pieData = [];
        for (let i = 0; i < e.value.length; i++) {
          pieData[i] = {
            name: e.text,
            type: e.type,
            avoidLabelOverlap: e.value[i][0].avoidLabelOverlap !== 'false',
            radius: ((Array.isArray(e.viewSetting) && e.viewSetting[i].radius) || e.viewSetting.radius) || ['35%', '60%'],
            center: ((Array.isArray(e.viewSetting) && e.viewSetting[i].center) || e.viewSetting.center) || ['50%', '50%'],
            roseType: ((Array.isArray(e.viewSetting) && e.viewSetting[i].roseType) || e.viewSetting.roseType) || false,
            label: e.value[i][0].label || this.label,
            labelLine: e.value[i][0].labelLine || this.labelLine,
            data: []
          };
          if (e.value[i][0].label === 'false') {
            pieData[i].label = { normal: { show: false }}
          }
          if (e.value[i][0].labelLine === 'false') {
            pieData[i].labelLine = { normal: { show: false }}
          }
          for (let j = 0; j < e.value[i].length; j++) {
            pieData[i].data[j] = e.value[i][j];
          }
        }
        return pieData
      }
      if (e.type === 'bar') {
        const barData = [];
        for (let i = 0; i < e.value[0].length; i++) {
          barData[i] = {
            type: 'bar',
            name: e.value[0][i].name,
            z: 3,
            data: e.value[0][i].filterName ? e.value[0][i].value.map((item) => { return item[e.value[0][i].filterName] }) : e.value[0][i].value,
            barMaxWidth: e.barWidth,
            stack: e.value[0][i].stack,
            barGap: e.value[0][i].barGap,
            label: e.value[0][i].label || {
              normal: {
                color: '#000',
                position: 'top',
                padding: (e.value[0][i].formatter && e.value[0][i].formatter.padding) || [0, 0],
                show: true,
                formatter: (e.value[0][i].formatter && e.value[0][i].formatter.text) || ('{c}' + (e.xData.symbol || '%'))
              }
            },
            itemStyle: e.value[0].length === 1 ? {
              normal: {
                color: (params) => {
                  if (e.value[0][i].itemStyle && e.value[0][i].itemStyle.color) { return e.value[0][i].itemStyle.color[params.dataIndex] }
                  return e.value[0][i].value[params.dataIndex].color || this.echartsColor[params.dataIndex]
                }
              }
            } : {}
          }
        }
        return barData
      }
      if (e.type === 'line') {
        const lineData = [];
        for (let i = 0; i < e.value[0].length; i++) {
          lineData[i] = {
            name: e.value[0][i].name,
            type: 'line',
            // stack: '总量',
            data: e.value[0][i].filterName ? e.value[0][i].value.map((item) => { return item[e.value[0][i].filterName] }) : e.value[0][i].value,
            showSymbol: !e.value[0][i].showSymbol,
            hoverAnimation: true,
            symbolSize: 5,
            smooth: !e.value[0][i].smooth,
            smoothMonotone: 'none',
            label: e.value[0][i].label || {
              normal: {
                color: '#000',
                position: 'top',
                padding: (e.value[0][i].formatter && e.value[0][i].formatter.padding) || [0, 0],
                show: true,
                formatter: (e.value[0][i].formatter && e.value[0][i].formatter.text) || ('{c}' + (e.xData.symbol || '%'))
              }
            }
          }
        }
        return lineData;
      }
    },
    xData(e) {
      let axis;
      axis = [
        { type: e.unify || 'category', name: e.Xname || '', boundaryGap: e.gap, interval: e.Xinterval, min: e.Xmin || null, max: e.Xmax || null, data: e.data || e,
          axisLine: {
            show: !(e.XaxisLine && e.XaxisLine.show),
            lineStyle: {
              color: (e.XaxisLine && e.XaxisLine.color) || '#000'
            }
          },
          axisTick: {
            show: e.XaxisTick
          },
          splitLine: {
            show: e.XsplitLine
          },
          axisLabel: {
            rotate: e.Xrotate,
            color: '#000'
          }
        },
        { type: e.unify || 'value', name: e.name || '', interval: e.interval, max: e.max || null, min: e.min || null,
          axisLabel: {
            formatter: e.formatter || function(value) {
              return value + (e.symbol || '');
            },
            color: '#000'
          },
          axisLine: {
            show: !(e.axisLine && e.axisLine.show),
            lineStyle: {
              color: (e.axisLine && e.axisLine.color) || '#000'
            }
          },
          axisTick: {
            show: !e.axisTick
          },
          splitLine: {
            show: !e.splitLine
          }}
      ];
      e.Xformatter && (axis[0].axisLabel.formatter = e.Xformatter);
      return axis;
    },
    distributionOption(e) {
      /* 饼图，条形，散点图参数入口*/
      let axis;
      if (e.type === 'bar' || e.type === 'line' || e.type === 'scatter' || (!e.type && e.xData !== undefined)) {
        axis = [[], []];
        (e.xData || (e.xData = {}));
        if (e.xData.length) {
          for (let i = 0; i < e.xData.length; i++) {
            if (e.xData[i].positionType === 'x' || !e.xData[i].positionType) {
              axis[0].push(this.xData(e.xData[i])[0]);
            }
            if (e.xData[i].positionType === 'y' || !e.xData[i].positionType) {
              axis[1].push(this.xData(e.xData[i])[1]);
            }
          }
        } else {
          axis = this.xData(e.xData);
        }
      }

      return {
        backgroundColor: '#fff',
        title: this.titleOption(e.title) || {},
        // dataset: (e.type || this.datasetSource(e)) && false,
        color: e.color || this.echartsColor,
        dataZoom: e.dataZoom || false,
        xAxis: (e.type === 'bar' || e.type === 'line' || e.type === 'scatter' || (!e.type && e.xData !== undefined)) ? (e.xData.type ? axis[1] : axis[0]) : false,
        yAxis: (e.type === 'bar' || e.type === 'line' || e.type === 'scatter' || (!e.type && e.xData !== undefined)) ? (e.xData.type ? axis[0] : axis[1]) : false,
        grid: e.grid || { x: 50, /* 左留白*/ x2: 15 /* 右留白*/},
        tooltip: {
          trigger: e.trigger || 'item',
          formatter: e.formatter,
          position: e.tooltip && e.tooltip.position
        },
        legend: this.LegendOption(e) || {},
        toolbox: this.toolboxOption() || {},
        series: (e.type && this.seriesData(e)) || this.seriesDataAll(e)
      }
    },
    rateOfProgressOption(e) {
      /* 进度饼图设置 value 已使用，entire：全部*/
      return {
        color: ['#3B86FF', '#EAECEE'],
        series: [
          {
            name: '任务进度',
            type: e.type,
            radius: ['85%', '100%'],
            avoidLabelOverlap: false,
            hoverAnimation: false,
            silent: true,
            labelLine: {
              normal: {
                show: false
              }
            },
            data: [
              {
                value: e.value,
                selected: false,
                label: {
                  normal: {
                    show: true,
                    position: 'center',
                    fontSize: 12,
                    formatter: '{d}%',
                    color: '#000'
                  }

                }

              },
              {
                value: e.entire - e.value,
                silent: true,
                legendHoverLink: false,
                label: {
                  normal: {
                    show: false
                  }
                }

              }

            ]
          }
        ]
      };
    },
    CurveContrastOption(e) {
      /* 曲线对比，有生命线*/
      const seriesData = [];
      for (let i = 0; i < e.value.length; i++) {
        seriesData.push({
          name: e.value[i].name,
          type: e.type,
          showSymbol: false,
          smooth: true,
          data: e.value[i].value || [],
          itemStyle: {
            normal: {
              color: e.color.line[i] || '#8ec6ad'
            }
          },
          markPoint: {
            itemStyle: {
              normal: {
                color: 'transparent'
              }
            },
            label: {
              normal: {
                show: true,
                position: e.value[i].position || 'insideRight',
                formatter: e.value[i].name,
                textStyle: {
                  color: e.color.line[i] || '#8ec6ad',
                  fontSize: 14
                }
              }
            },
            data: [{
              coord: e.value[i].value[e.value[i].value.length - 1]
            }]
          }
        })
      }
      return {
        tooltip: {
          triggerOn: 'none',
          axisPointer: {
            type: 'cross'
          }
        },
        xAxis: {
          show: true,
          min: e.xAxis.min || 0,
          max: e.xAxis.max || 100,
          name: e.xAxis.name,
          type: 'value',
          axisLine: { onZero: false, symbol: ['none', 'arrow'] },
          scale: true,
          splitNumber: 10,
          axisLabel: { formatter: function(value) {} },
          axisPointer: {
            show: e.xAxis.pointer || true,
            value: e.xAxis.max ? e.xAxis.max / 2 : 100 / 2,
            snap: false,
            triggerTooltip: false,
            lineStyle: {
              show: true,
              color: '#000',
              opacity: 0.5,
              width: 1
            },
            label: {
              show: true,
              formatter: function(params) {
                return e.goldThreadText;
              },
              margin: e.position || 10,
              color: '#000',
              backgroundColor: '#fff',
              shadowBlur: 0
            },
            handle: {
              show: true,
              size: 0,
              color: '#004E52'
            }
          },
          splitLine: {
            show: false
          }
        },
        yAxis: {
          show: true,
          min: e.yAxis.min || 0,
          max: e.yAxis.max || 60,
          name: e.yAxis.name,
          type: 'value',
          axisLine: { onZero: false, symbol: ['none', 'arrow'] },
          axisLabel: { formatter: function(value) {} },
          axisPointer: {
            show: e.yAxis.pointer || false,
            value: e.yAxis.max ? e.yAxis.max / 2 : 100 / 2,
            snap: false,
            triggerTooltip: false,
            lineStyle: {
              show: true,
              color: '#004E52',
              opacity: 0.5,
              width: 1
            },
            label: {
              show: true,
              formatter: function(params) {
                return e.goldThreadText;
              },
              margin: e.position || 10,
              color: '#000',
              backgroundColor: '#fff',
              shadowBlur: 0
            },
            handle: {
              show: true,
              size: 0,
              color: '#004E52'
            }
          },
          splitLine: {
            show: false
          }
        },
        series: seriesData
      }
    },
    initCharts(e1, callback) {
      if (window.outTime) {
        for (let i = 0; i < window.outTime.length; i++) {
          clearTimeout(window.outTime[i])
        }
      }
      window.outTime = [];
      e1.forEach((e, index) => {
        if (e.chart) { return }
        window.outTime[index] = setTimeout(() => {
          try {
            e.chart = echarts.init(document.getElementById(e.id));
          } catch (e) {
            return;
          }
          this.loadCharts(e);
          e.events && e.chart.on(e.events, function(e) {
            callback(e, index);
          });
        }, 300 * index)
      });
    },
    loadCharts(e) {
      if (e.type === 'pie' && typeof e.value === 'number') {
        e.functions = 'rateOfProgressOption';
      } else if (e.type === 'pie' || e.type === 'bar' || e.type === 'line' || e.type === 'scatter') {
        e.functions = 'distributionOption';
      }
      if (e.type === 'line') {
        // e.functions = 'CurveContrastOption';
      }
      if (!e.type) {
        e.functions = 'distributionOption';
      }

      module(startModule);
      e.chart.setOption(this[e.functions](e))
    },
    setCharts(e, id, callback, eventsCallback) {
      if (id) {
        callback ? callback(this.height(id)) : '';
      }
      const that = this;
      setTimeout(() => {
        if (typeof id === 'object') {
          /* 正常情况*/
          that.initCharts(e, eventsCallback);
        } else {
          /* 不用返回高度的情况下，直接第二位为事件回调函数*/
          that.initCharts(e, id);
        }
        if (id) {
          that.windowResize(e, id, function(e) {
            callback ? callback(e) : '';
          });
        }
      }, 100)
    },
    windowResize(e, id, callback) {
      /* 监控屏幕变化*/
      var setIn = null;
      clearInterval(window.setout);
      window.setout = setInterval(() => {
        if (this.sidebarStatus !== Cookies.get('sidebarStatus')) {
          this.sidebarStatus = Cookies.get('sidebarStatus');
          setTimeout(() => {
            callback ? callback(this.height(id)) : '';
            setTimeout(() => {
              e.forEach(e => {
                if (e.chart) {
                  e.chart.resize();
                }
              });
            }, 10)
          }, 200)
        }
      }, 300);
      window.onresize = null;
      window.onresize = () => {
        clearTimeout(setIn);
        const This = this;
        setIn = setTimeout(function() {
          setTimeout(function() {
            e.forEach(e => {
              if (e.chart) {
                e.chart.resize();
              }
            });
          }, 100);
          try {
            callback ? callback(This.height(id)) : '';
          } catch (err) {
            window.onresize = null;
          }
        }, 300);
      }
    },
    height(e) {
      if (typeof e === 'function') return;
      if (e.length === 0) { return 0 }
      if (typeof e[0] === 'string') {
        try {
          const height = document.getElementById(e[0]).offsetWidth * e[1];
          // document.getElementById(e[0]).style.height = height;
          return height;
        } catch (e) { }
      }
      const height = [];
      for (let i = 0; i < e[0].length; i++) {
        try {
          height[i] = document.getElementById(e[0][i]).offsetWidth * e[1][i];
          // document.getElementById(e[0][i]).style.height = height[i];
        } catch (e) { }
      }
      return height;
    }
  };
}
